import React from 'react';
import Mask from './mask';

export default class Consult extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            data: this.props.data
        };
        this.handleClick = this.handleClick.bind(this)
    }
    static propTypes = {
        data: React.PropTypes.array.isRequired
    };
    handleClick(){}
    render(){
        let items = this.state.data.map((_d,i)=>{
            let type = {};
            switch (_d.type){
                case 'chat':
                    type.name = '图文咨询';
                    type.price = (_d.price>0)?('￥'+_d.price+'/次'):'暂未开放';
                    break;
                case 'tel':
                    type.name = '语音咨询';
                    type.price = (_d.price>0)?('￥'+_d.price+'/分钟'):'暂未开放';
                    break;
                case 'video':
                    type.name = '视频咨询';
                    type.price = (_d.price>0)?('￥'+_d.price+'/分钟'):'暂未开放';
                    break;
            }
            type.state = (_d.price<=0)?'invalid-server':'';
            type.id = 'consult'+_d.type;
            return <li key={type.id} className={type.state}>
                <div id={type.id} data-target={_d.type}>
                    <span>{type.name}<em>{type.price}</em></span>
                </div>
            </li>
        });
        return <ul id="consult">{items}</ul>
    }
}